<template>
    <view class="goods">
       <view class="goodsItem" v-for="(item,index) in list" :key="index" @click="onDeatil(item)">
       	<image class="goodsImg" :src="item.image" mode=""></image>
		<view class="goodsText">
			{{item.name}}
		</view>
       </view>
    </view>
</template>

<script setup>
import {
    onReachBottom,
    onShow,
    onLoad
} from '@dcloudio/uni-app';
import {ref} from "vue"

import {summarycategory} from '../../network/home.js'

let list = ref([])

summarycategory().then(res=>{
	list.value = res.data
})


const onDeatil = (data) =>{
	uni.navigateTo({
		url:'/pages/class/detail?id='+data.id
	})
}



</script>

<style lang="scss" scoped>
	.goods{
		display: grid;
		grid-template-columns: repeat(3,1fr);
		padding: 30rpx 40rpx;
		box-sizing: border-box;
		gap: 39rpx 65rpx;
		
	}
	
	.goodsImg {
		width: 180rpx;
		height: 180rpx;
	}
	
	.goodsText {
		font-weight: bold;
		font-size: 28rpx;
		color: #333333;
	}
</style>
